<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Прогноз Погоды</title>
    <meta charset="UTF-8">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" th:href="@{/info.css}"/>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="d-flex justify-content-center align-items-center vh-100">
    <div class="box">
        <h1>Погода в:</h1>
        <h2 th:text="${locationModel.city} + ' ' + ${locationModel.state} + ' ' + ${locationModel.country}"></h2>
        <table>
            <tbody>
            <tr>
                <td class="align-middle">Описание:</td>
                <td class="align-middle" th:text="${weather_description}"></td>
            </tr>
            <tr>
                <td class="align-middle">Температура:</td>
                <td class="align-middle" th:text="${temp}"></td>
            </tr>
            <tr>
                <td class="align-middle">Максимальная температура:</td>
                <td class="align-middle" th:text="${temp_max}"></td>
            </tr>
            <tr>
                <td class="align-middle">Минимальная температура:</td>
                <td class="align-middle" th:text="${temp_min}"></td>
            </tr>
            <tr>
                <td class="align-middle">Влажность:</td>
                <td class="align-middle" th:text="${humidity}"></td>
            </tr>
            </tbody>
        </table>
        <a class="d-flex justify-content-center" href="/weather">
            <button>Проверить другой город</button>
        </a>
    </div>
</div>
</body>
</html>
